<template>
  <div class="views-container">
    <div class="goodsBtn">
      <el-button @click="toAddLiveGoods" type="primary" >添加商品</el-button>
       <el-button @click="getApproved"  :loading="loading">同步商品数据</el-button>
        <el-button @click="goodsWareHouse" type="primary" :loading="loading">同步审核数据</el-button>
      <!-- <el-button @click="submitAuditAll">批量审核</el-button> -->
    </div>
    <div class="goodsBtn">
      <el-tabs type="border-card" v-model="tableFormatData.livegoods.files.status" @tab-click="filesSerch">
        <el-tab-pane label="全部申请" name="0" ></el-tab-pane>
        <el-tab-pane label="已入库" name="2"  ></el-tab-pane>
        <el-tab-pane label="审核中" name="1" ></el-tab-pane>
        <el-tab-pane label="审核未通过" name="3"></el-tab-pane>

        <el-table
          :ref="tableFormatData.livegoods.key"
          :data="tableFormatData.livegoods.tableData"
          tooltip-effect="dark"
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column prop="sort" width="80" label="排序" sortable>
            <template slot-scope="scope">
              <el-input-number @blur="changeTableItem({id:scope.row.live_goods_id,sort:scope.row.goods_sort},tableFormatData.livegoods.change.sort)" style="width:100%;" size="mini" v-model="scope.row.goods_sort" :controls="false"></el-input-number>
            </template>
          </el-table-column>
          <el-table-column prop="name" label="商品图">
            <template slot-scope="scope">
              <img class="logo" :src="scope.row.cover_img_url"/>
            </template>
          </el-table-column>
          <el-table-column prop="address" label="商品名称" show-overflow-tooltip>
            <template slot-scope="scope">
              <span>{{scope.row.name}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="address" label="价格" show-overflow-tooltip>
            <template slot-scope="scope" >
              <span v-if="scope.row.price_type==1">一口价：{{scope.row.price}}</span>
              <span v-else-if="scope.row.price_type==2">价格：{{scope.row.price}}-{{scope.row.price2}}</span>
               <span v-else-if="scope.row.price_type==3">原价：{{scope.row.price}}-现价：{{scope.row.price2}}</span>
            </template>

          </el-table-column>
          <el-table-column prop="address" label="链接" show-overflow-tooltip>
            <template slot-scope="scope">
              <span>{{scope.row.url}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="address" label="状态" show-overflow-tooltip>
            <template slot-scope="scope">
              <span v-if="scope.row.audit_status==5">未审核</span>
              <span v-else-if="scope.row.audit_status==1">审核中</span>
              <span v-else-if="scope.row.audit_status==2">审核通过</span>
              <span v-else-if="scope.row.audit_status==3">审核失败</span>
            </template>
          </el-table-column>
          <el-table-column prop="address" label="操作" show-overflow-tooltip>
            <template slot-scope="scope">
              <div class="operation-group" v-if="scope.row.audit_status==5 || scope.row.audit_status==3">
                <el-button type="text" @click="submitAudit(scope.row.live_goods_id)">提交审核</el-button>
                <router-link
                class="wlm-text"
                tag="a"
                target="_blank"
                :to="{path:'/livetelecast/addlivegoods', query:{
                  id:scope.row.live_goods_id,
                  store_user_id:$route.query.store_user_id?$route.query.store_user_id:'',
                  h_aid:$route.query.h_aid?$route.query.h_aid:'',
                  }}">
                  <el-button type="text">编辑</el-button>
                </router-link>
                <el-button type="text"   @click="handleDelete(scope.$index, scope.row)">删除</el-button>
              </div>

               <div class="operation-group" v-if="scope.row.audit_status==2">
                  <router-link
                class="wlm-text"
                tag="a"
                target="_blank"
                :to="{path:'/livetelecast/addlivegoods', query:{
                  id:scope.row.live_goods_id,
                  store_user_id:$route.query.store_user_id?$route.query.store_user_id:'',
                  h_aid:$route.query.h_aid?$route.query.h_aid:'',
                  }}">
                  <el-button type="text">编辑</el-button>
                </router-link>
                <el-button type="text"  @click="handleDelete(scope.$index, scope.row)">删除</el-button>
              </div>
               <div class="operation-group" v-if="scope.row.audit_status==1">

                <el-button type="text"  @click="revocation(scope.row.live_goods_id)">撤销审核</el-button>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </el-tabs>
      <div class="pagination-content flex-row flex-justify-e flex-align-c">
          <el-pagination
:disabled="!hasTableData"
@size-change="listPageChange"
           @current-change="listPageChange"
:current-page.sync="tableFormatData.livegoods.pagination.page"
           :page-sizes="tableFormatData.livegoods.pagination.pagesizes"
           :page-size.sync="tableFormatData.livegoods.pagination.list_rows"
layout="total, sizes, prev, pager, next, jumper"
           :total="hasTableData?tableFormatData.livegoods.pagination.total : 0">
          </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import mixins from '@/mixins/mixins'
import { liveGoodsList, auditLiveGoods, modifyLiveGoodsSort, deleteLiveGoods, resetLiveGoodsAudit, getApproved, getGoodsWareHouse } from '@/api/upload'
export default {
  mixins: [mixins.getters('Table')],
  name: 'Livegoods',
  data() {
    return {
      loading: false,
      pindex:1,
      tableFormatData: {
        current: 'livegoods',
        livegoods: {
          key: 'livegoods',
          api: { getList: liveGoodsList,
            delList: deleteLiveGoods },
          tableData: [],
          files: {
            // cover_img_url: '',
            // name: '',
            // price_type: 1,
            // price: 0,
            // price2: 0

            status: 0

          },
          pagination: {
            page: 1,
            list_rows: 10,
            pagesizes: [10, 20, 50],
            total: 0
          },
          change: {
            sort: {
              name: '排序',
              key: 'sort',
              api: modifyLiveGoodsSort
            }
          }
        }
      },

      multipleSelection: [],
      allGoods: []
    }
  },
  methods: {
    getApproved() {
      this.loading = true
      this.getApproved1()

    },
    getApproved1(){
getApproved({ status: this.tableFormatData.livegoods.files.status - 0, page: this.pindex }).then(res => {

       if(res.data.data.done==0){
 this.pindex=parseInt(this.pindex)+1;
            this.getApproved()
       }else{
  this.loading = false
  this.$message.success("同步数据成功！")
          this.filesEmpty()
          this.pindex=1;
       }

      })
    },
    goodsWareHouse() {
      if (this.allGoods.length == 0) {
        this.$message({
          type: 'error',
          message: '请先勾选需要同步的商品'
        })
        return
      } else {
        this.loading = true
        getGoodsWareHouse({ ids: this.allGoods }).then(res => {
          console.log(res)
          this.loading = false
          if (res.data.code == 1) {
            this.filesEmpty()
          }
        })
      }
    },
    revocation(id) {
      resetLiveGoodsAudit({ id }).then(res => {
        console.log(res)
        if (res.data.code == 1) {
          this.$message.success('操作成功！')
          this.filesEmpty()
        }
      })
    },
    toAddLiveGoods() {
      this.$router.push('/livetelecast/addlivegoods')
    },
    submitAudit(id) {
      auditLiveGoods({ id }).then((res) => {
        if (res.data.code == 1) {
          this.$message.success('操作成功！')
          this.filesEmpty()
        }
      })
    },

    // submitAuditAll(){
    //  if(this.multipleSelection.length>0){
    //    auditLiveGoods({id:this.multipleSelection}).then(res=>{
    //      console.log('------------------------------')
    //     console.log(res)
    //    })
    //  }
    // },
    handleDelete(index, row) {
      console.log(index, row)
      this.$confirm('此操作将删除该直播商品, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        // this.$message({
        //   type: 'success',
        //   message: '删除成功!'
        // });
        deleteLiveGoods({ id: row.live_goods_id }).then(res => {
          const { code } = res.data
          code == 1 && this.$message.success('操作成功')
          this.filesEmpty()
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    toggleSelection(rows) {
      if (rows) {
        rows.forEach((row) => {
          this.$refs.multipleTable.toggleRowSelection(row)
        })
      } else {
        this.$refs.multipleTable.clearSelection()
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = []
      this.allGoods = []
      val.map((item) => {
        this.allGoods.push(item.live_goods_id)
        if (item.audit_status == 5) {
          this.multipleSelection.push(item.live_goods_id)
        }
      })

      console.log(this.multipleSelection)
    }
  }
}
</script>

<style lang="scss" scoped>
.goodsBtn {
  padding: 16px;
  background-color: #ffffff;
}
</style>
